<template>
    <div>
        <header>
            <van-nav-bar left-arrow  @click-left="fant">
                <template #right>
                        <span class="icon_top">
                            <img class="cups"
                            src="../../../assets/icon/hdpi/common_nav_message_black_n.png"
                            alt=""
                            />
                        </span>
                    </template>
                </van-nav-bar>
        </header>
        <main>
            <div class="reply_box">
                <div class="">
                    <div>
                        <p>设置自动回复 <span><van-switch v-model="checked" /></span></p>
                    </div>
                    <div>
                        <p>正在忙,稍后为您解答</p>
                    </div>
                    <div>
                        <p>请先详细描述下您的情况！</p>
                    </div>
                    <div>
                        <p>我每天下午5:00-7:00之间有空,将会在那个时间段回复您</p>
                    </div>
                    <div>
                        <p>自定义</p>
                    </div>
                </div>
                <div class="">
                    <textarea name="" id="" cols="48" rows="3" placeholder="请输入自定义内容">

                    </textarea>
                    <div class="buttom">
                        <button>提交</button>
                    </div>
                </div>
            </div>
        </main>
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { useRouter } from "vue-router";
const router = useRouter();
const fant = () => {
  router.go(-1);
}

 const checked = ref(true);
   
</script>

<style scoped>

.reply_box
{
    width: 100%;
    height: 90vh;
}
.buttom
{
    width: 100%;
    height: 40px;
    
}

.buttom button
{
    width: 100%;
    height: 40px;
    background: #3F45FF;
    color: #fff;
    border: none;
}
</style>